<template>
  <div class="qzgu">
     <div class="register">
        <div class="content">
            <p class="question"></p>
            <div class="logo">
                <h1><a href="/index" title="小米官网" target="_blank">小米官网</a></h1>
            </div>
            <h1 class="mi">登入小米账号</h1>
            <!-- 表单部分 -->
            <form action="" class="form_im" id="check">
                <h4> 
                    <strong></strong>
                    <input type="username" name="username" placeholder="请输入用户名" required="required" class="wenben1"
                        id="text" v-model="puusetyt.username">
                        <br>
                </h4>
                <h4>
                    <i></i>
                    <input type="password" name="password" placeholder="请输入密码" class="wenben2" required="required"
                        minlength="6" id="password" v-model="puusetyt.password"><br>
                </h4>

                <button class="log_in" @click="dr">登入</button><br/>
                <button class="log_in" @click="zc">注册</button>
                <span id="tishi"></span>
            </form>
            <div class="read">
                <a href=""> 已阅读并同意： 小米 <strong class="strong1"> 用户协议 </strong> 和 <strong class="strong2"> 隐私政策
                    </strong></a>
            </div>
            <!-- 尾部备注制作 -->
            <div class="footer">
                <div class="footer_top">
                    <a href="" class="style_black">简体</a>5
                    <span>|</span>
                    <a href="" class="gray">繁体</a>
                    <span>|</span>
                    <a href="" class="gray"> English </a>
                    <span>|</span>
                    <a href="" class="gray">常见问题</a>
                </div>
                <div class="footer_bottom">
                    <p>小米公司版权所有-京ICP备10046444-</p>
                    <a href=""><img src="./image/ghs.png" alt="">
                    
                        京公网安备11010802020134号-京ICP证110507号</a>
                </div>
            </div>
        </div>
    </div>
  </div>
</template>

<script>

import './css/base.css'
import './css/register.css'

export default {
    data(){
      return{
        puusetyt:{
            username:'',
            password:''
           
      },
        
     }
    },
    methods:{
       async dr(){
        const {data:res}=await this.$http.post('Login',this.puusetyt)
          if(res.meta.status!=400) return this.$message.error('登入失败!')
            this.$message.success('登入成功')
            window.sessionStorage.setItem("token",res.data);
            this.$router.push("/index");
           
       },
       zc(){
         this.$router.push("/register");
       }
       
    }
}   
</script>
   
<style lang="less" scoped>
 .qzgu {
    display: flex;
    justify-content: center;
    align-items: center;
    background: url(./image/background2.jpg);
    background-size: cover;
    background-position: left;
    background-attachment: fixed;
}
</style>